import { Form, Input, Select, Radio } from 'antd';
import {state as states} from "@/stores/Merchant"
import {useSnapshot} from "valtio"
interface Props {
    form: any;
    setForm: any;
    title:string
}
const BindForm= ({ form, setForm, title }: Props) => {
    const state = useSnapshot(states);
    return (
        <div>
            <Form
                name="basic"
                autoComplete="off"
            >
                <Form.Item
                    className='m-l-2.5'
                    label={title+"账号"}
                >
                    <Input
                        value={form.account}
                        onChange={(e) => {
                            setForm({ ...form, account: e.target.value })
                        }}
                    />
                </Form.Item>
                <Form.Item
                    className='m-l-2.5'
                    label={title+"店铺名称"}
                >
                    <Input 
                        value={form.shopName}
                        onChange={(e) => {
                            setForm({ ...form, shopName: e.target.value })
                        }}
                    />
                </Form.Item>
                <Form.Item
                    className='m-l-2.5'
                    label={title+"链接ID"}
                >
                    <Input 
                        value={form.linkid}
                        onChange={(e) => {
                            setForm({ ...form, linkid: e.target.value })
                        }}
                    />
                </Form.Item>
                <Form.Item
                    className='m-l-2.5'
                    label="要绑定的店铺"
                >
                    <Select
                        style={{ marginRight: "10px", width: "200px" }}
                        defaultValue="请选择"
                        value={form.bindShop}
                        onChange={(e) => { setForm({ ...form, bindShop: e }) }}
                        options={[...state.shopCate]}
                    />
                </Form.Item>
                <Form.Item
                    className='m-l-2.5'
                    label="联系方式"
                >
                    <Input 
                        value={form.phone}
                        onChange={(e) => {
                            setForm({ ...form, phone: e.target.value })
                        }}
                    />
                </Form.Item>
                <Form.Item
                    className='m-l-2.5'
                    label="是否接单"
                >
                    <Radio.Group onChange={(e)=>{
                        setForm({ ...form, isorder: e.target.value })}} value={form.isorder}>
                        <Radio value={true}>接单</Radio>
                        <Radio value={false}>不接单</Radio>
                    </Radio.Group>
                </Form.Item>
                <Form.Item
                    className='m-l-2.5'
                    label="是否发送订单到配送员APP"
                >
                    <Radio.Group onChange={(e) => { setForm({ ...form, istodelivery: e.target.value }) }} value={form.istodelivery}>
                        <Radio value={true}>发送</Radio>
                        <Radio value={false}>不发送</Radio>
                    </Radio.Group>
                </Form.Item>
              

            </Form>
        </div>
    );
};

export default BindForm;